@import './_function.less';
@import './_menuBar.less';
.checkbox {
    .dn;
    appearance: none;
    &+i {
        .db;
        .w(22);
        .h(22);
        border: 1px solid @c3f;
        .br(3);
    }
    &:checked+i {
        background-image: url('../img/icon-checked.png');
        background-repeat: no-repeat;
        .bs(19,
        13);
        .bp(2,
        6);
    }
}

.header {
    .h(88);
    .bc(@mainColor);
    display: flex;
    justify-content: space-between;
    align-items: center;
    .back {
        .w(26);
        .h(45);
        background-image: url('../img/icon-back.png');
        .bs(26,
        45);
    }
    h2 {
        .fs(40);
        .c(@cW);
    }
    .edit {
        .fs(32);
        .c(@cW);
    }
}

.main {
    .bc(@ce6);
    .oh;
    .mh(1200);
}

.check {
    .h(50);
    .oh;
    .lh(50);
    .checkbox+i {
        .fl;
        .mr(20);
        .mt(13);
    }
}

.shop-list {
    .oh;
    .list {
        .p(20,
        20,
        20,
        20);
        .bc(@cW);
        .oh;
        display: flex;
        justify-content: space-between;
        align-items: top;
        .mb(20);
    }
    img {
        .w(198);
        .h(198);
        .mr(20);
        border: 1px solid #e5e5e5;
    }
    .desc {
        .w(425);
        display: flex;
        justify-content: space-between;
        flex-direction: column;
    }
    .title {
        .fs(36);
        .c(@c3f);
        .lh(40);
        .h(100);
    }
    .spec-box {
        .oh;
    }
    .spec {
        .fl;
        .fs(24);
        .c(@c3f);
        .lh(40);
        span {
            .mr(10);
        }
    }
    .num-wrap {
        .fr;
        .w(140);
        .h(38);
        .pr;
        border: 1px solid #b7b7b7;
        input {
            .w(60);
            .h(38);
            .fl;
            border: none;
            .utn;
            .tc;
            .lh(36);
            background-color: transparent;
        }
        .reduce,
        .add {
            .w(38);
            .h(38);
            background-image: url('../img/icon-calculate.png');
            background-repeat: no-repeat;
            .bs(38,
            76);
        }
        .reduce {
            .fl;
            .bp(0,
            -42);
            border-right: 1px solid #b7b7b7;
        }
        .add {
            .fr;
            .pa;
            .bp(0,
            1);
            border-left: 1px solid #b7b7b7;
            .t;
            .r;
        }
    }
    .price-box {
        .oh;
    }
    .price {
        .fl;
        .fs(26);
        .c(@cr);
    }
    .free {
        .fr;
        .fs(24);
        .c(@c3f);
    }
}

.pay-bar {
    .pf;
    .b(98);
    .l(0);
    .h(80);
    .w(750);
    .bc(@cW);
    .left {
        .w(522);
        .pl(20);
        .pr(20);
        .fl;
        label {
            .lh(80);
        }
    }
    .checkbox+i {
        .fl;
        .mr(20);
        .mt(27);
    }
    .total-wrap {
        .fr;
        .tr;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        .h(80);
    }
    .money {
        .c(@cr);
    }
    .total {
        .fs(30);
    }
    .fare {
        .fs(24);
    }
    .pay {
        .w(188);
        .bc(@cr);
        .h(80);
        .tc;
        .lh(80);
        .fr;
        .c(@cW);
        .fs(44);
    }
}
